
<style>

    body {
        margin: 60px 10px;
        padding: 0;
        font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
        font-size: 14px;
    }

    #calendar {
        max-width: 1100px;
        margin: 0 auto;
    }

</style>
<div class="layuimini-main">
    <input name="id" id="id" type="hidden" />
    <div id="calendar"></div>
</div>


<script>

    layui.use(['form',  'axios','element',], function () {
        var $ = layui.jquery,
            form = layui.form,
            table = layui.table,
            miniPage = layui.miniPage;
        var axios = layui.axios;
        var element = layui.element;



        $("#calendar").fullCalendar(
            {
                monthNamesShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
                dayNamesShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
                defaultView:'month',
                editable: false,//不能进行编辑
                firstDay: "1",
                events:function(start, end, timezone, callback) {//ajax请求数据并显示在响应时间段内
                    axios.post('work/queryListByUserID2',{})
                        .then(function(response){
                            var events = [];
                            var data=response.data;
                            for(let item in data){
                                if(data[item].title!="0"){
                                    events.push({
                                        title:data[item].title,
                                        start:data[item].day,
                                        date:data[item].day ,
                                        color: 'red',
                                        display: 'background',

                                    })
                                }else{
                                    events.push({
                                        title:'休息',
                                        start:data[item].day,
                                        date:data[item].day ,
                                        color: 'blue',
                                        display: 'background',

                                    })
                                }

                            }
                            // $(".fc-mon").css('backgroundColor','grey');//这个是周六的TD
                            // $(".fc-sun").css('backgroundColor','#c4e1ff');//这个是周日的TD
                            // $(".fc-sat").css('backgroundColor','#c4e1ff');//这个是周六的TD
                            // $(".fc-sun").css('backgroundColor','#c4e1ff');//这个是周日的TD

                            callback(events);//成功的回调函数
                        })


                }
            }



        );

        //重载
        window.reload = function(alist){
            $("#calendar").fullCalendar("refetchEvents");
        }
    });
</script>
</body>
</html>